const path  = require("path");
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const htmlWebpackPlugin = require('html-webpack-plugin');
const { DefinePlugin } = require("webpack")
const CopyPlugin = require('copy-webpack-plugin');


module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'build.js',
        path: path.resolve(__dirname, 'dist'),
        // assetModuleFilename: 'img/[name].[hash:4][ext]'
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: [
                    "style-loader",
                    {
                        loader: "css-loader",
                        options:{
                            importLoaders:1,
                            esModule: false
                        }
                    },
                    "postcss-loader",
                ]
            },
            {
                test: /\.less$/,
                use: [
                    "style-loader",
                    "css-loader",
                    "postcss-loader",
                    "less-loader"
                ]
            },
            // {
            //     test: /\.(png|jpe?g|svg|gif)$/,
            //     type: 'asset/resource',
            //     generator: {
            //         filename: "img/[name].[hash:4][ext]"
            //     }
            // },
            // {
            //     test: /\.(png|jpe?g|svg|gif)$/,
            //     type: 'asset/inline'
            // },
            {
                test: /\.(png|jpe?g|svg|gif)$/,
                type: 'asset',
                generator: {
                    filename: "img/[name].[hash:4][ext]"
                },
                parser: {
                    dataUrlCondition: {
                        maxSize: 25 * 1024
                    }
                }
            },
        ]
    },
    plugins: [
        new CleanWebpackPlugin(),
        new htmlWebpackPlugin({
            title: "html-webpack-plugin",
            template: './public/index.html'
        }),
        new DefinePlugin({
            BASE_URL: '"./public/"'
        }),
        new CopyPlugin({
            patterns: [
                {
                  from: "./public/*.ico",
                  to: path.resolve(__dirname, './dist'),
                },
            ],
        })
    ]
}